<template>
  <div>
    <BasicModal width="80%"
                v-bind="$attrs"
                @register="registerModal"
                title="留学生认证详情"
                @ok="handleSubmit">
      <Description @register="register" />
    </BasicModal>
  </div>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { Description, useDescription } from '/@/components/Description/index';
import { DetailsApi } from '/@/api/user/internationalStudents';
import { schema } from './data';
export default defineComponent({
  name: 'SalesUserModal',
  components: {
    BasicModal,
    Description,
  },
  emits: ['success', 'register'],
  setup() {
    const mockData = ref({});
    const [registerModal, { closeModal }] = useModalInner(async (data) => {
      mockData.value = {};
      const detail = await DetailsApi(data.record.id);
      const cityItem = data.citylist.filter((item) => {
        return item.id == detail.data.city;
      });
      detail.data.bigareaForm = `${cityItem[0].city || ''}-${detail.data.area || ''}`;
      mockData.value = { ...detail.data };
    });
    const [register] = useDescription({
      data: mockData,
      column: 1,
      schema: schema,
    });
    async function handleSubmit() {
      console.log('确认事件', mockData);
      closeModal();
    }
    return {
      registerModal,
      register,
      closeModal,
      handleSubmit,
      schema,
    };
  },
});
</script>
